<template>
  <view class="obtain">
    <view class="windows">
      <view class="obtainprize">恭喜获得</view>
      <view class="commodityimg">
          <image :src="boxthedata.productImg" alt="" />
      </view>
      <view class="prizehint">
        <view>【{{this.boxthedata.productName}}】</view>
        <view>奖品已收入个人账户</view>
      </view>
      <view class="btnok" @click="btnok">我知道了</view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    boxthedata: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {};
  },
  created() {
    console.log(26, this.boxthedata);
  },
  methods: {
    btnok() {
      if (this.boxthedata.productType === "shop") {
        this.$emit("CloseWindows");
      } else {
        this.$emit("closeshow");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
/*.obtain {
  position: relative;
  z-index: 5;
  width: 100vw;
  height: 100vh;
  background-color: #4c4c4c;
  overflow: hidden;
  .windows {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 560rpx;
    height: 680rpx;
    color: #fff;
    // margin: 310rpx auto;
    transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 5%;
    overflow: hidden;
    .obtainprize {
      text-align: center;
      color: #4577e8;
      font-size: 42rpx;
      margin: 70rpx 0 31rpx 0;
      font-weight: 700;
    }
    .commodityimg {
      width: 203rpx;
      height: 203rpx;
      // background-color: skyblue;
      margin: 0 auto;
      image {
        width: 100%;
        height: 100%;
      }
    }
    .prizehint {
      display: flex;
      flex-direction: column;
      // width: 252rpx;
      height: 88rpx;
      line-height: 44rpx;
      color: #000;
      margin: 37rpx auto 48rpx auto;
      font-size: 28rpx;
      text-align: center;
      // border: 1rpx solid pink;
    }
    .btnok {
      width: 478rpx;
      height: 86rpx;
      border-radius: 46rpx;
      text-align: center;
      line-height: 86rpx;
      background: url("/static/tag_ac.png") no-repeat center;
      font-size: 32rpx;
      margin: 0 auto;
    }
  }
}*/
.windows {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 560rpx;
  height: 680rpx;
  color: #fff;
  // margin: 310rpx auto;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 5%;
  overflow: hidden;
  .obtainprize {
    text-align: center;
    color: #4577e8;
    font-size: 42rpx;
    margin: 70rpx 0 31rpx 0;
    font-weight: 700;
  }
  .commodityimg {
    width: 203rpx;
    height: 203rpx;
    // background-color: skyblue;
    margin: 0 auto;
    image {
      width: 100%;
      height: 100%;
    }
  }
  .prizehint {
    display: flex;
    flex-direction: column;
    // width: 252rpx;
    height: 88rpx;
    line-height: 44rpx;
    color: #000;
    margin: 37rpx auto 48rpx auto;
    font-size: 28rpx;
    text-align: center;
    // border: 1rpx solid pink;
  }
  .btnok {
    width: 478rpx;
    height: 86rpx;
    border-radius: 46rpx;
    text-align: center;
    line-height: 86rpx;
    background: url("/static/tag_ac.png") no-repeat center;
    font-size: 32rpx;
    margin: 0 auto;
  }
}
</style>
